<template>
    <div id="addReceiving">
        <yd-cell-group style="margin-bottom:0">
            <yd-cell-item>
                <span slot="left">姓名：</span>
                <yd-input slot="right" required :show-required-icon='false' v-model.trim="trueName" ref="nameName" placeholder="请输入姓名"></yd-input>
            </yd-cell-item>
            <yd-cell-item>
                <span slot="left">手机号码：</span>
                <yd-input slot="right" required :show-required-icon='false' v-model="mobPhone" ref="phoneName" regex="mobile" placeholder="请输入手机号码"></yd-input>
            </yd-cell-item>
            <yd-cell-item>
                <span slot="left">所在区域：</span>
                <yd-input slot="right" @click.native="show = true" required :show-required-icon='false' v-model="regionAc" readonly ref="regioneName" placeholder="请选择"></yd-input>
            </yd-cell-item>
            <yd-cell-item>
                <span slot="left">详细地址：</span>
                <yd-input slot="right" required :show-required-icon='false' v-model.trim="address" ref="addresseName" placeholder="请输入收货人详细地址"></yd-input>
            </yd-cell-item>
        </yd-cell-group>
        <div class="dangerBtn">
            <yd-button size="large" v-if="msgs == ''" @click.native="dangerBtn" type="danger">保存地址</yd-button>
            <yd-button size="large" v-else @click.native="dangerEditBtn" type="danger">修改地址</yd-button>
        </div>
        <yd-cityselect v-model="show" :ready='isReady' ref="cityselectDemo" :callback="result" :items="district" :provance="regionText" :city="cityText" :area="areaText"></yd-cityselect>
    </div>
</template>
<script>
import District from '@/../static/city'

export default {
    name: 'addReceiving',
    data() {
        return {
            isReady: false,
            show: false,
            district: [],
            addressId: 0,
            regionAc: "",
            trueName: "",  //#####必填
            regionId: '1',  // #####必填
            areaId: '',
            cityId: '',     //#####必填
            regionText: '北京',  // #####必填
            cityText: '',     //#####必填
            areaText: '',
            areaInfo: "",
            address: "",   //#####必填
            telPhone: "",
            mobPhone: "",   //#####必填
            isDefault: '1',  //###### 1默认收货地址 0非默认
            deliverExplain: "",
            msgs: ''
        }
    },
    created: function() {
        this.msgs = this.$route.query.msg || '';
        this.district = District;
        if (this.msgs) {
            this.editInit();
        } else {
            this.isReady = true;
        }
    },
    methods: {
        //修改
        editInit() {
            this.$axios.get(this.CONSTANT.wapiBaseUrl + 'address/editAddr?addressId=' + this.msgs)
                .then((response) => {
                    if (response.status == 200) {
                        this.trueName = response.data.object.trueName;
                        this.address = response.data.object.address;
                        this.telPhone = response.data.object.telPhone;
                        this.mobPhone = response.data.object.mobPhone;
                        this.regionId = response.data.object.regionId.toString();
                        this.cityId = response.data.object.cityId.toString();
                        this.areaId = response.data.object.areaId.toString();
                        this.regionText = response.data.object.regionName;
                        this.cityText = response.data.object.cityName;
                        this.areaText = response.data.object.areaName;
                        this.regionAc = response.data.object.regionName + response.data.object.cityName + response.data.object.areaName;
                        this.isReady = true;
                    }
                })
        },
        //确定修改
        dangerEditBtn() {
            //let nameName = this.$refs.nameName;
            if (this.trueName == '') {
                this.$dialog.toast({
                    mes: '姓名不可为空',
                    timeout: 600
                });
                return false;
            }
            if (this.mobPhone == '') {
                this.$dialog.toast({
                    mes: '手机号不可为空',
                    timeout: 600
                });
                return false;
            }
            let phoneName = this.$refs.phoneName;
            if (!phoneName.valid) {
                this.$dialog.toast({
                    mes: '手机号格式不正确',
                    timeout: 600
                });
                return false;
            }
            if (this.regionAc == "") {
              this.$dialog.toast({
                mes: "地址所在区域不可为空",
                timeout: 1000
              });
              return false;
            }
            if (this.address == '') {
                this.$dialog.toast({
                    mes: '详细地址不可为空',
                    timeout: 600
                });
                return false;
            }
            let msg = {
                addressId: this.msgs,
                trueName: this.trueName,
                regionId: Number(this.regionId),
                cityId: Number(this.cityId),
                areaId: Number(this.areaId),
                address: this.address,
                telPhone: this.telPhone,
                mobPhone: this.mobPhone,
                isDefault: this.isDefault
            }
            this.$dialog.loading.open('请稍后');
            this.$httpAjax.post(this.CONSTANT.wapiBaseUrl + 'address/editAddrUpdate', msg)
                .then((response) => {
                    this.$dialog.loading.close();
                    if (response.status == 200) {
                        this.$dialog.toast({
                            mes: '修改成功',
                            icon: 'success',
                            timeout: 600
                        });
                        setTimeout(() => {
                             this.$router.go(-1);
                        }, 600);
                    } else {
                        this.$dialog.toast({
                            mes: '修改失败，请稍后重试',
                            icon: 'error',
                            timeout: 600
                        });
                    }
                }).catch((error) => {
                    this.$dialog.loading.close();
                });
        },
        result(ret) {
            // "regionId": 2, #########省份id
            // "cityId": 40, #########市级ID
            // "areaId": 58, #########地区ID
            this.regionId = ret.itemValue1.toString();
            this.cityId = ret.itemValue2.toString();
            this.areaId = ret.itemValue3.toString();
            this.regionAc = ret.itemName1 + ret.itemName2 + ret.itemName3;
        },
        dangerBtn() {
            let nameName = this.$refs.nameName;
            if (!nameName.valid) {
                this.$dialog.toast({
                    mes: '姓名不可为空',
                    timeout: 600
                });
                return false;
            }
            if (this.mobPhone == '') {
                this.$dialog.toast({
                    mes: '手机号不可为空',
                    timeout: 600
                });
                return false;
            }
            let phoneName = this.$refs.phoneName;
            if (!phoneName.valid) {
                this.$dialog.toast({
                    mes: '手机号格式不正确',
                    timeout: 600
                });
                return false;
            }
            if (this.address == '') {
                this.$dialog.toast({
                    mes: '详细地址不可为空',
                    timeout: 600
                });
                return false;
            }
            let msg = {
                trueName: this.trueName,
                regionId: Number(this.regionId),  //省份
                cityId: Number(this.cityId),      //市
                areaId: Number(this.areaId),      //县
                address: this.address,
                telPhone: this.telPhone,
                mobPhone: this.mobPhone,
                isDefault: this.isDefault
            }
            this.$dialog.loading.open('请稍后');
            this.$httpAjax.post(this.CONSTANT.wapiBaseUrl + 'address/newAddrAdd', msg)
                .then((response) => {
                    this.$dialog.loading.close();
                    if (response.status == 200) {
                        this.$dialog.toast({
                            mes: '保存成功',
                            icon: 'success',
                            timeout: 600
                        });
                        setTimeout(() => {
                            this.$router.go(-1);
                        }, 600);
                    } else {
                        this.$dialog.toast({
                            mes: '保存失败，请稍后重试',
                            icon: 'error',
                            timeout: 600
                        });
                    }
                }).catch((error) => {
                    this.$dialog.loading.close();
                });
        }
    }
}
</script>
<style  scoped>
.dangerBtn {
    width: 100%;
    box-sizing: border-box;
    padding: 0 0.25rem;
    height: auto;
    overflow: hidden;
}
</style>